@adminforth/markdown 1.7.0 → 1.9.0

package/build.log

@@ -10,5 +10,5 @@ custom/package-lock.json
 custom/package.json
 custom/tsconfig.json
 
-sent 29,849 bytes  received 115 bytes  59,928.00 bytes/sec
-total size is 29,417  speedup is 0.98
+sent 32,725 bytes  received 115 bytes  65,680.00 bytes/sec
+total size is 32,299  speedup is 0.98

package/custom/MarkdownEditor.vue

@@ -229,10 +229,60 @@ function getTurndownService(): TurndownService {
       return `![${altFinal}](${src} "${escapedTitle}")`;
     },
   });
-
+  turndownService.escape = (s: string) => s;
   return turndownService;
 }
 
+function toggleWrap(ed: monaco.editor.IStandaloneCodeEditor, left: string, right = left) {
+  const m = ed.getModel();
+  if (!m) return;
+
+  const selections = ed.getSelections() || [];
+  if (!selections.length) return;
+
+  const edits: monaco.editor.IIdentifiedSingleEditOperation[] = [];
+  const nextSelections: monaco.Selection[] = [];
+
+  for (const sel of selections) {
+    const text = m.getValueInRange(sel);
+
+    if (sel.isEmpty()) {
+      edits.push({ range: sel, text: `${left}${right}` });
+      const pos = sel.getStartPosition();
+      const col = pos.column + left.length;
+      nextSelections.push(new monaco.Selection(pos.lineNumber, col, pos.lineNumber, col));
+      continue;
+    }
+
+    const isWrapped = text.startsWith(left) && text.endsWith(right) && text.length >= left.length + right.length;
+
+    if (isWrapped) {
+      const unwrapped = text.slice(left.length, text.length - right.length);
+      edits.push({ range: sel, text: unwrapped });
+
+      const start = sel.getStartPosition();
+      nextSelections.push(new monaco.Selection(start.lineNumber, start.column, start.lineNumber, start.column + unwrapped.length));
+    } else {
+      edits.push({ range: sel, text: `${left}${text}${right}` });
+
+      const start = sel.getStartPosition();
+      nextSelections.push(
+        new monaco.Selection(
+          start.lineNumber,
+          start.column + left.length,
+          start.lineNumber,
+          start.column + left.length + text.length,
+        ),
+      );
+    }
+  }
+
+  ed.pushUndoStop();
+  ed.executeEdits('md-format', edits);
+  ed.pushUndoStop();
+  ed.setSelections(nextSelections);
+}
+
 let editor: monaco.editor.IStandaloneCodeEditor | null = null;
 let model: monaco.editor.ITextModel | null = null;
 const disposables: monaco.IDisposable[] = [];
@@ -310,13 +360,14 @@ function updateImagePreviews() {
       preview.style.display = 'inline-block';
       preview.style.borderRadius = '6px';
       preview.style.overflow = 'hidden';
-      preview.style.maxWidth = '220px';
-      preview.style.maxHeight = '140px';
+      preview.style.maxWidth = '440px';
+      preview.style.maxHeight = '280px';
+
 
       const imageEl = document.createElement('img');
       imageEl.src = img.src;
-      imageEl.style.maxWidth = '220px';
-      imageEl.style.maxHeight = '140px';
+      imageEl.style.maxWidth = '440px';
+      imageEl.style.maxHeight = '280px';
       imageEl.style.display = 'block';
       imageEl.style.opacity = '0.95';
 
@@ -325,7 +376,7 @@ function updateImagePreviews() {
 
       const zone: monaco.editor.IViewZone = {
         afterLineNumber: img.lineNumber,
-        heightInPx: 160,
+        heightInPx: 320,
         domNode: wrapper,
       };
 
@@ -336,7 +387,7 @@ function updateImagePreviews() {
       imageEl.onload = () => {
         if (!editor) return;
         const measured = wrapper.offsetHeight;
-        const nextHeight = Math.max(40, Math.min(200, measured || 160));
+        const nextHeight = Math.max(60, Math.min(520, measured || 320));
         if (zone.heightInPx !== nextHeight) {
           zone.heightInPx = nextHeight;
           editor.changeViewZones((a) => a.layoutZone(zoneId));
@@ -455,8 +506,38 @@ onMounted(async () => {
       model,
       language: 'markdown',
       automaticLayout: true,
+      wordWrap: 'on',
+      wrappingStrategy: 'advanced',
+      wrappingIndent: 'same',
+      scrollbar: {
+        horizontal: 'hidden',
+      },
+      scrollBeyondLastColumn: 0,
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyI, () => {
+      toggleWrap(editor!, '*');
     });
 
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyB, () => {
+      toggleWrap(editor!, '**');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyU, () => {
+      toggleWrap(editor!, '<u>', '</u>');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyE, () => {
+      toggleWrap(editor!, '`');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.Shift | monaco.KeyCode.KeyX, () => {
+      toggleWrap(editor!, '~~');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyK, () => {
+      const selection = editor!.getSelection();
+      if (!selection) return;
+      const text = model?.getValueInRange(selection) || '';
+      const escaped = escapeMarkdownLinkText(text);
+      const markdownLink = `[${escaped}](url)`;
+      editor!.executeEdits('insert-link', [{ range: selection, text: markdownLink, forceMoveMarkers: true }]);
+    });
     debug('Monaco editor created', {
       hasUploadPluginInstanceId: Boolean(props.meta?.uploadPluginInstanceId),
     });

package/dist/custom/MarkdownEditor.vue

@@ -229,10 +229,60 @@ function getTurndownService(): TurndownService {
       return `![${altFinal}](${src} "${escapedTitle}")`;
     },
   });
-
+  turndownService.escape = (s: string) => s;
   return turndownService;
 }
 
+function toggleWrap(ed: monaco.editor.IStandaloneCodeEditor, left: string, right = left) {
+  const m = ed.getModel();
+  if (!m) return;
+
+  const selections = ed.getSelections() || [];
+  if (!selections.length) return;
+
+  const edits: monaco.editor.IIdentifiedSingleEditOperation[] = [];
+  const nextSelections: monaco.Selection[] = [];
+
+  for (const sel of selections) {
+    const text = m.getValueInRange(sel);
+
+    if (sel.isEmpty()) {
+      edits.push({ range: sel, text: `${left}${right}` });
+      const pos = sel.getStartPosition();
+      const col = pos.column + left.length;
+      nextSelections.push(new monaco.Selection(pos.lineNumber, col, pos.lineNumber, col));
+      continue;
+    }
+
+    const isWrapped = text.startsWith(left) && text.endsWith(right) && text.length >= left.length + right.length;
+
+    if (isWrapped) {
+      const unwrapped = text.slice(left.length, text.length - right.length);
+      edits.push({ range: sel, text: unwrapped });
+
+      const start = sel.getStartPosition();
+      nextSelections.push(new monaco.Selection(start.lineNumber, start.column, start.lineNumber, start.column + unwrapped.length));
+    } else {
+      edits.push({ range: sel, text: `${left}${text}${right}` });
+
+      const start = sel.getStartPosition();
+      nextSelections.push(
+        new monaco.Selection(
+          start.lineNumber,
+          start.column + left.length,
+          start.lineNumber,
+          start.column + left.length + text.length,
+        ),
+      );
+    }
+  }
+
+  ed.pushUndoStop();
+  ed.executeEdits('md-format', edits);
+  ed.pushUndoStop();
+  ed.setSelections(nextSelections);
+}
+
 let editor: monaco.editor.IStandaloneCodeEditor | null = null;
 let model: monaco.editor.ITextModel | null = null;
 const disposables: monaco.IDisposable[] = [];
@@ -310,13 +360,14 @@ function updateImagePreviews() {
       preview.style.display = 'inline-block';
       preview.style.borderRadius = '6px';
       preview.style.overflow = 'hidden';
-      preview.style.maxWidth = '220px';
-      preview.style.maxHeight = '140px';
+      preview.style.maxWidth = '440px';
+      preview.style.maxHeight = '280px';
+
 
       const imageEl = document.createElement('img');
       imageEl.src = img.src;
-      imageEl.style.maxWidth = '220px';
-      imageEl.style.maxHeight = '140px';
+      imageEl.style.maxWidth = '440px';
+      imageEl.style.maxHeight = '280px';
       imageEl.style.display = 'block';
       imageEl.style.opacity = '0.95';
 
@@ -325,7 +376,7 @@ function updateImagePreviews() {
 
       const zone: monaco.editor.IViewZone = {
         afterLineNumber: img.lineNumber,
-        heightInPx: 160,
+        heightInPx: 320,
         domNode: wrapper,
       };
 
@@ -336,7 +387,7 @@ function updateImagePreviews() {
       imageEl.onload = () => {
         if (!editor) return;
         const measured = wrapper.offsetHeight;
-        const nextHeight = Math.max(40, Math.min(200, measured || 160));
+        const nextHeight = Math.max(60, Math.min(520, measured || 320));
         if (zone.heightInPx !== nextHeight) {
           zone.heightInPx = nextHeight;
           editor.changeViewZones((a) => a.layoutZone(zoneId));
@@ -455,8 +506,38 @@ onMounted(async () => {
       model,
       language: 'markdown',
       automaticLayout: true,
+      wordWrap: 'on',
+      wrappingStrategy: 'advanced',
+      wrappingIndent: 'same',
+      scrollbar: {
+        horizontal: 'hidden',
+      },
+      scrollBeyondLastColumn: 0,
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyI, () => {
+      toggleWrap(editor!, '*');
     });
 
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyB, () => {
+      toggleWrap(editor!, '**');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyU, () => {
+      toggleWrap(editor!, '<u>', '</u>');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyE, () => {
+      toggleWrap(editor!, '`');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.Shift | monaco.KeyCode.KeyX, () => {
+      toggleWrap(editor!, '~~');
+    });
+    editor.addCommand(monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyK, () => {
+      const selection = editor!.getSelection();
+      if (!selection) return;
+      const text = model?.getValueInRange(selection) || '';
+      const escaped = escapeMarkdownLinkText(text);
+      const markdownLink = `[${escaped}](url)`;
+      editor!.executeEdits('insert-link', [{ range: selection, text: markdownLink, forceMoveMarkers: true }]);
+    });
     debug('Monaco editor created', {
       hasUploadPluginInstanceId: Boolean(props.meta?.uploadPluginInstanceId),
     });

package/dist/index.js

@@ -175,6 +175,16 @@ export default class MarkdownPlugin extends AdminForthPlugin {
                         existing.title = next.title;
                     }
                 };
+                const normalizeAttachmentTitleForDb = (title) => {
+                    // we can llow to use [xx] in titles, for some meta classes - so they will nto go to attachment titles, but will be available in the ending markdown
+                    if (title === null) {
+                        return null;
+                    }
+                    const cleaned = title
+                        .replace(/\s*(?:\([^()]*\)|\[[^\[\]]*\])\s*$/, '')
+                        .trim();
+                    return cleaned || null;
+                };
                 function getAttachmentMetas(markdown) {
                     var _a, _b, _c, _d, _e, _f;
                     if (!markdown) {
@@ -188,7 +198,7 @@ export default class MarkdownPlugin extends AdminForthPlugin {
                     for (const match of markdown.matchAll(imageRegex)) {
                         const altRaw = (_a = match[1]) !== null && _a !== void 0 ? _a : '';
                         const srcRaw = match[2];
-                        const titleRaw = (_c = ((_b = match[3]) !== null && _b !== void 0 ? _b : match[4])) !== null && _c !== void 0 ? _c : null;
+                        const titleRaw = normalizeAttachmentTitleForDb((_c = ((_b = match[3]) !== null && _b !== void 0 ? _b : match[4])) !== null && _c !== void 0 ? _c : null);
                         const key = getKeyFromTrackedUrl(srcRaw);
                         if (!key) {
                             continue;

package/index.ts

@@ -194,6 +194,17 @@ export default class MarkdownPlugin extends AdminForthPlugin {
         }
       };
 
+      const normalizeAttachmentTitleForDb = (title: string | null): string | null => {
+        // we can llow to use [xx] in titles, for some meta classes - so they will nto go to attachment titles, but will be available in the ending markdown
+        if (title === null) {
+          return null;
+        }
+        const cleaned = title
+          .replace(/\s*(?:\([^()]*\)|\[[^\[\]]*\])\s*$/, '')
+          .trim();
+        return cleaned || null;
+      };
+
       function getAttachmentMetas(markdown: string): AttachmentMeta[] {
         if (!markdown) {
           return [];
@@ -209,7 +220,7 @@ export default class MarkdownPlugin extends AdminForthPlugin {
         for (const match of markdown.matchAll(imageRegex)) {
           const altRaw = match[1] ?? '';
           const srcRaw = match[2];
-          const titleRaw = (match[3] ?? match[4]) ?? null;
+          const titleRaw = normalizeAttachmentTitleForDb((match[3] ?? match[4]) ?? null);
 
           const key = getKeyFromTrackedUrl(srcRaw);
           if (!key) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adminforth/markdown",
-  "version": "1.7.0",
+  "version": "1.9.0",
   "description": "Markdown plugin for adminforth",
   "type": "module",
   "main": "dist/index.js",